


        main .pageHead{
            max-width: 1600px;
            margin: 0px auto;
            
        }
        main .pageHead .contn{
            position: relative;
        }
        main .pageHead .contn .btm img{
            display: block;
            width: 100%;
            height: auto;
        }
        main .pageHead .contn .tp{
            position: absolute;
            z-index: 2;
            width: 95%;
            top: 0px;
            left: 50%;
            transform: translateX(-50%);
        }
        main .pageHead .contn .tp .pic{
            position: relative;
            padding-bottom: 50%;
            overflow: hidden;
            clip-path: polygon(30px 0%,calc(100% - 30px) 0,calc(100% - 30px) 30px,50% 100%,30px 30px);
        }
        main .pageHead .contn .tp .pic::before,
        main .pageHead .contn .tp::after{
            content: '';
            position: absolute;
            box-sizing: border-box;
            width: 30%;
            height: calc(1600px * .95 * .3);
            border: solid calc(1600px * .95 * .026) rgba(170,170,170,.25);
            left: 50%;
            transform: translateX(-50%) rotate(45deg);
            z-index: 2;
            margin-top: 35px;
            top:calc(100% - 1600px * .95 * .3 * 2.414213 / 2);
        }
        main .pageHead .contn .tp::after{
            border-width: 0px;
            background: #e5e5e5;
            opacity: .45;
            z-index: -1;
            
        }
        main .pageHead .contn .tp .pic img{
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: auto;
        }
        main .pageHead .contn .tp .txt{
            z-index: 2;
            position: absolute;
            width: 100%;
            left: 0px;
            text-align: center;
            margin-top: 35px;
            top:calc(100% - 1600px * .95 * .3 * 1.414213 / 2);
            transform: translateY(-50%);
            padding-top: 100px;
            opacity: 0;
            transition: padding .8s, opacity .8s;
        }
        main .pageHead .contn .tp .txt.frozen{
            padding-top: 0px;
            opacity: 1;
        }
        main .pageHead .contn .tp .txt p{
            margin-bottom: 35px;
            line-height: 1;
            font-weight: bold;
            font-size: 70px;
            text-transform: uppercase;
        }
        main .pageHead .contn .tp .txt p:last-child{
            margin-bottom: 0px;
        }
        main .pageHead .contn .tp .txt .dsnName{
            font-size: 24px;
            letter-spacing: 8px;
            margin-top: 0px;
            font-weight: normal;
        }

        main .tips{
            max-width: 1410px;
            margin: 0px auto;
            text-align: center;
        }
        main .tips>.t{
            max-width: 1050px;
            margin: 0px auto;
            font-size: 24px;
            line-height: 1.6;
            padding-top: 115px;
            padding-bottom: 91px;
            letter-spacing: 2px;
            opacity: 0;
            transform: translateY(-30px);
            transition: transform .8s, opacity .8s;
        }
        main .tips>.t.frozen{
            opacity: 1;
            transform: translateY(0px);
        }
        main .tips .list{
            padding-top: 77px;
            padding-bottom: 150px;
        }
        main .tips .list .item{
            width: 375px;
            height: 375px;
            display: inline-block;
            vertical-align: top;
            position: relative;
            z-index: 2;
            margin-left: 54px;
        }
        main .tips .list .item:first-child{
            margin-left: 0px;
        }
        main .tips .list .item:nth-child(2){
            z-index: 3;
        }
        main .tips .border{
            transform: rotate(45deg);
            background: #f5f5f5;
        }
        main .tips .border i{
            position: absolute;
            background: #e4e4e5;
            transition: all .35s;
        }
        main .tips .border .hor{
            height: 13px;
            width: 0px;
        }
        main .tips .border .ver{
            width: 13px;
            height: 0px;
        }
        main .tips .border .tp,
        main .tips .border .tp + *{
            top: 0px;
        }
        main .tips .border .rht,
        main .tips .border .rht + *{
            right: 0px;
        }
        main .tips .border .btm,
        main .tips .border .btm + *{
            bottom: 0px;
        }
        main .tips .border .btm,
        main .tips .border .btm + *{
            bottom: 0px;
        }
        main .tips .border .lft,
        main .tips .border .tp{
            left: 0px;
        }
        main .tips .border .tp{
            transition-delay: .35s;
        }
        main .tips .border .rht{
            transition-delay: .7s;
        }
        main .tips .border .btm{
            transition-delay: 1.05s;
        }
        main .tips .border .lft{
            transition-delay: 1.4s;
        }
        main .tips .list .item.frozen .border .hor{
            width: 100%;
        }
        main .tips .list .item.frozen .border .ver{
            height: 100%;
        }
        main .tips .list .item .txt{
            width: 280px;
            font-size: 18px;
            line-height: 1.5;
            color: #333;
            margin-top: 30px;
            opacity: 0;
            transition: margin .8s, opacity .8s;
            transition-delay: 1.2s;
            z-index: 2;
        }
        main .tips .list .item.frozen .txt{
            margin-top: 0px;
            opacity: 1;
        }
        main .tips .list .item .txt .topic{
            font-size: 28px;
            margin-bottom: 35px;
            color: #000;
            font-weight: bold;
            line-height: 1;
        }
        main .tips .list .item .block{
            width: 38px;
            height: 38px;
            border: 13px solid #e4e4e5;
            box-sizing: content-box;
            position: absolute;
            z-index: 2;
            pointer-events: none;
        }
        main .tips .list .item .block::before,
        main .tips .list .item .block::after{
            content: '';
            position: absolute;
            width: 13px;
            height: 13px;
            background: #f5f5f5;
            z-index: 2;
        }
        main .tips .list .item .block::before{
            top: 0px;
            left: 0px;
            transform: translate(-100%,-100%);
        }
        main .tips .list .item .block::after{
            bottom: 0px;
            right: 0px;
            transform: translate(100%,100%);
        }
        main .tips .list .item .block.tpRht{
            top: 0px;
            right: 0px;
        }
        main .tips .list .item .block.btmLft{
            left: 0px;
            bottom: 0px;
        }
        main .tips .swiper{
            position: relative;
            width: 488px;
            height: 488px;
            left: 50%;
            margin-left: -244px;
        }
        main .tips .swiper .tipSwiper{
            height: 100%;
        }
        main .tips .swiper .tipSwiper .swiper-slide{
            height: 100%;
        }
        main .tips .swiper .tipSwiper .inner{
            position: absolute;
            width: 300px;
            height: 300px;
            left: 50%;
            top: 64px;
            transform: translateX(-50%);
        }
        main .tips .swiper .tipSwiper .inner .border .hor{
            height: 10px;
        }
        main .tips .swiper .tipSwiper .inner .border .ver{
            width: 10px;
        }
        main .tips .swiper.frozen .tipSwiper .inner .border .hor{
            width: 100%;
        }
        main .tips .swiper.frozen .tipSwiper .inner .border .ver{
            height: 100%;
        }
        main .tips .swiper .tipSwiper .inner .txt{
            flex-direction: column;
            top: 38px;
            left: 38px;
            bottom: 38px;
            right: 38px;
            position: absolute;
            margin: auto;
            z-index: 2;
            font-size: 12px;
            transform: initial;
        }
        main .tips .swiper .tipSwiper .inner .txt .topic{
            font-size: 20px;
            margin-bottom: 28px;
            color: #000;
            font-weight: bold;
            line-height: 1;
        }
        main .tips .swiper .btn{
            width: 50px;
            height: 50px;
            position: absolute;
            z-index: 2;
            top: calc(300px * 1.414213 / 2);
            transform: translateY(-50%);
        }
        main .tips .swiper .prev{
            background: url(../img/cateInfo/btns.png) 0 -100px;
            left: 54px;
        }
        main .tips .swiper .next{
            background: url(../img/cateInfo/btns.png) 0 0px;
            right: 54px;
        }

        main .note,
        main .selected,
        main .us .inner,
        main .articles .inner{
            padding: 0px 53px;
            max-width: 1499px;
            margin: 0 auto;
            position: relative;
        }
        main .note .lft,
        main .note .rht{
            opacity: 0;
            transform: translateX(-100px);
            transition: opacity 1s, transform 1s;
        }
        main .note.frozen .lft,
        main .note.frozen .rht{
            opacity: 1;
            transform: translateX(0px);
        }
        main .note .lft{
            width: 58%;
            padding-top: 55px;
            position: relative;
        }
        main .note .lft .pic img{
            display: block;
            width: 100%;
            height: auto;
        }
        main .note .lft .icon{
            position: absolute;
            top: 0px;
            left: 80px;
            z-index: 2;
        }
        main .note .rht{
            position: absolute;
            top: calc((100% - 55px) * .1 + 55px);
            bottom: calc((100% - 55px) * .1);
            margin: auto;
            transform: translateX(100px);
            width: 43%;
            border: 6px solid #dededf;
            z-index: 2;
            padding: 0 2.5% 0 6.5%;
        }
        main .note .rht .txt{
            font-size: 16px;
            line-height: 1.5;
            height: 100%;
            flex-direction: column;
        }
        main .note .rht .noteTtl{
            font-size: 32px;
            font-weight: bold;
            line-height: initial;
            margin-bottom: 30px;
        }
        main .note .rht,
        main .note>a{
            right: 53px;
        }
        main .note>a{
            position: absolute;
            padding-left: 33px;
            background: url(../img/common/linkIcon.png) no-repeat left center;
            margin-right: 4%;
            top: 0px;
            line-height: 20px;
            font-size: 16px;
            transition: color .7s;
        }
        main .note>a:hover{
            color: #cec7ad;
        }

        main .selected{
            margin-top: 95px;
            padding-bottom: 90px;
            background: #fff;
            z-index: 3;
        }
        main .selected .list{
            overflow: hidden;
        }
        main .selected .list .item{
            position: relative;
            padding-top: 100px;
            float: left;
            width: 100%;
            margin-right: -100%;
            overflow: hidden;
            opacity: 0;
            transition: opacity .8s;
            pointer-events: none;
        }
        main .selected .list .item.active{
            opacity: 1;
            transition-delay: .8s;
            pointer-events: all;
        }
        main .selected .list .item .pics{
            position: relative;    
        }
        main .selected .list .item .pics a{
                display: block
        }
        main .selected .list .item .pics .lft{
            width: 68%;
            height: 756px;
        }
        main .selected .list .item .pics .rht{
            width: 40%;
            top: 70px;
            position: absolute;
            right: 0px;
            z-index: 2;
            top: 70px;
            right: 0px;
            height: 725px;
        }
        main .selected .list .item .pics .lft img,
        main .selected .list .item .pics .rht img,
        main .selected .list .item .txt{
            transition: transform .8s, opacity .8s;
            opacity: 0;
        }
        main .selected .list .item .pics .lft img{
            transform: translateX(-20px);
        }
        main .selected .list .item .pics .rht img{
            transform: translateX(30px);
        }
        main .selected .list .item.active .pics .rht img{
            transition-delay: 1.1s;
        }
        main .selected .list .item.active .pics a img,
        main .selected .list .item.active .txt{
            transform: translateX(0px);
            opacity: 1;
        }
        main .selected .list .item .txt{
            transform: translateX(-50px);
        }
        main .selected .list .item.active .txt{
            transition-delay: 1s;
        }
        main .selected .list .item .txt .itemName{
            padding-top: 20px;
            padding-bottom: 13px;
            font-weight: bold;
            font-size: 28px;
        }
        main .selected .list .item .txt .inf{
            font-weight: bold;
            font-size: 18px;
        }
        main .selected .list .item .txt .inf p{
            display: inline-block;
            vertical-align: top;
        }
        main .selected .list .item .txt .inf span{
            font-weight: lighter;
        }
        main .selected .list .item .txt .more{
            margin-top: 10px;
        }
        main .selected .list .item .tip{
            position: absolute;
            width: 30%;
            top: 0px;
            right: 0px;
            padding-top: 65px;
            transition: transform .8s,opacity .8s;
            transform: translateY(-350px);
            opacity: 0;
        }
        
        main .selected .list .item.active .tip{
            transform: translateY(0px);
            opacity: 1;
        }
        main .selected .list .item .tip::before{
            content: '';
            position: absolute;
            width: 170px;
            height: 170px;
            border: 10px solid #f4f4f4;
            top: 40px;
            right: 88px;
            transform: translateX(20px) rotate(45deg);
            opacity: 0;
            transition: transform .5s 1.4s,opacity .5s 1.4s;
        }
        main .selected .list .item.active .tip::before{
            transform: translateX(0px) rotate(45deg);
            opacity: 1;
        }
        main .selected .list .item .tip .extra{
            max-width: 350px;
            position: relative;
            z-index: 2;
            display: table;
            opacity: 0;
            transition: transform .8s 1.6s,opacity .8s 1.6s;
            transform: translateY(220px);
        }
        main .selected .list .item.active .tip .extra{
            transform: translateY(0px);
            opacity: 1;
        }
        main .selected .list .item .tip .extra span{
            display: table-cell;
            vertical-align: middle;
            text-transform: uppercase;
        }
        main .selected .list .item .tip .extra .symbol{
            color: #c0b594;
            font-size: 72px;
        }
        main .selected .list .item .tip .extra .price{
            font-weight: bold;
            font-size: 127px;
            line-height: 1;
        }
        main .selected .list .item .tip .extra .t{
            padding-left: 20px;
            font-size: 16px;
        }
        
        

        main .selected .muchMore{
            clear: both;
            margin-top: 18px;
        }
        main .selected .muchMore span{
            line-height: 20px;
            height: 20px;
            padding-left: 40px;
            position: relative;
            color: #000;
            transition: color .5s;
            font-size: 12px;
            letter-spacing: 3px;
            background: url(../img/common/linkIcon.png) no-repeat center left;
        }
        main .selected .muchMore:hover span{
            color: #fff;
        }
        main .selected .muchMore span::before{
            content: '';
            width: 21px;
            height: 20px;
            top: 0px;
            left: 0px;
            position: absolute;
            z-index: 2;
            pointer-events: none;
            background: url(../img/common/linkIcon.png) no-repeat center center;
            opacity: 0;
            transition: opacity .5s;
        }
        main .selected .muchMore:hover span::before{
            opacity: 1;
        }
        main .selected .btn{
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 50px;
            height: 50px;
            cursor: pointer;
            z-index: 2;
        }
        main .selected .btn:before{
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0px;
            left: 0px;
            opacity: 0;
            z-index: 2;
            transition: opacity .7s;
            pointer-events: none;
        }
        main .selected .btn.prev{
            left: -25px;
            background: url(../img/common/arrows-white.png) 0px -153px;
        }
        main .selected .btn.prev:before {
            background: url(../img/common/arrows-white.png) 0px -102px;
        }
        main .selected .btn.next{
            right: -25px;
            background: url(../img/common/arrows-white.png) 0px 0px;
        }
        main .selected .btn.next:before {
            background: url(../img/common/arrows-white.png) 0px -51px;
        }
        main .selected .btn:hover:before{
            opacity: 1;
        }


        main .advice{
            position: relative;
            padding-bottom: 87px;
            z-index: 2;
            background: #fff;
        }
        main .advice::before{
            content: '';
            position: absolute;
            z-index: -1;
            top: calc(50% - 87px / 2);
            left: 50%;
            transform: translate(-50%,-50%) rotate(45deg);
            width: 550px;
            height: 550px;
            box-sizing: border-box;
            border: 40px solid #e8e9e9;
            margin-top: -100px;
            transition: margin .8s,opacity .8s;
            opacity: 0;
        }
        main .advice.frozen::before{
            opacity: 1;
            margin-top: 0px;
        }
        main .advice .swiper{
            overflow: hidden;
            position: relative;
        }
        main .advice .swiper::before,
        main .advice .swiper::after{
            content: '';
            position: absolute;
            pointer-events: none;   
        }
        main .advice .swiper>*:not(img){
            position: relative;
            z-index: 3;
        }
        main .advice .swiper::after{
            background: #e9eaea;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            opacity: .8;
            z-index: 2;
        }
        main .advice .swiper::before{
            width: 550px;
            height: 550px;
            border: 36px solid rgba(31,36,42,0.1);
            left: 50%;
            top: 50%;
            pointer-events: none;
            transform: translate(-50%,-50%) rotate(45deg);
            z-index: 3;
        }
        main .advice .swiper .bgPic{
            opacity: .6;
        }
        main .advice .swiper .palace{
            transform:translateY(100px);
            opacity: 0;
            transition: transform .8s,opacity .8s;
            overflow: hidden;
        }
        main .advice .swiper .palace.frozen{
            opacity: 1;
            transform: translateY(0px);
        }
        main .advice.frozen .swiper{
            opacity: 1;
            transform: translateY(0px);
        }
        main .advice .swiper li{
            float: left;
            width: 100%;
            margin-right: -100%;
            height: 640px;
            pointer-events: none;
            opacity: 0;
            transition: opacity .8s;
        }
        main .advice .swiper li.active{
            pointer-events: all;
            opacity: 1;
        }
        main .advice .swiper li .box{
            max-width: 560px;
            height: 100%;
            margin: 0 auto;
            text-align: center;
            font-size: 18px;
            display: table;
        }
        main .advice .swiper li .box .inner{
            display: table-cell;
            vertical-align: middle;
        }
        main .advice .swiper li .box .inner .hgLtr{
            font-size: 52px;
            font-weight: bold;
            margin-top: 35px;
            padding-bottom: 35px;
            position: relative;
            margin-bottom: 20px;
        }
        main .advice .swiper li .box .inner .hgLtr:after, 
        main .advice .swiper li .box .inner .hgLtr:before{
            content: '';
            position: absolute;
            bottom: 0px;
            width: 9px;
            height: 9px;
            border: 2px solid #000;
            left: calc(50% - 8px);
            transform: rotate(45deg);
            transition: transform .5s .6s;
        }
        main .advice .swiper li .box .inner .hgLtr:before{
            transform: translateX(-10px) rotate(45deg);
        }
        main .advice .swiper li .box .inner .hgLtr:after{
            transform: translateX(10px) rotate(45deg);
        }
        main .advice .swiper li .box .inner .hgLtr span:after{
            content: '';
            position: absolute;
            bottom: 0px;
            width: 9px;
            height: 9px;
            border: 2px solid #000;
            left: calc(50% - 8px);
            transform: rotate(45deg);
            transition: transform .5s .6s;
        }
        main .advice .swiper li .box .inner .t{
            line-height: 1.8;
        }
        main .advice .swiper .btn{
            position: absolute;
            top: calc(50% - 25px);
            left: calc(50% - 25px);
            width: 50px;
            height: 50px;
            cursor: pointer;
            z-index: 4;
        }
        main .advice .swiper .btn:before{
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0px;
            left: 0px;
            opacity: 0;
            z-index: 2;
            transition: opacity .7s;
            pointer-events: none;
        }
        main .advice .swiper .btn:hover:before{
            opacity: 1;
        }
        main .advice .swiper .btn.prev{
            margin-left: calc(40px - 550px * 1.414213 / 2);
            background: url(../img/common/arrows-white.png) 0px -153px;
        }
        main .advice .swiper .btn.prev:before{
            background: url(../img/common/arrows-white.png) 0px -102px;
        }
        main .advice .swiper .btn.next{
            margin-left: calc(550px * 1.414213 / 2 - 40px);
            background: url(../img/common/arrows-white.png) 0px 0px;
        }
        main .advice .swiper .btn.next:before{
            background: url(../img/common/arrows-white.png) 0px -51px;
        }
        main .advice .swiper .pagination{
            position: absolute;
            width: 100%;
            left: 0px;
            bottom: 145px;
            transform: translateY(-40px);
            opacity: 0;
            transition: transform .8s,opacity .8s;
            transition-delay: .5s;
        }
        main .advice .swiper .palace.frozen + .pagination{
            opacity: 1;
            transform: translateY(0px);
        }
        main .advice .swiper .pagination p{
            width: 22px;
            height: 22px;
            transform: rotate(45deg);
            position: relative;
            border: 2px solid transparent;
            transition: border .7s;
            cursor: pointer;
            margin: 0px 7px;
        }
        main .advice .swiper .pagination p.active{
            border-color: #fff;
        }
        main .advice .swiper .pagination p::after{
            content: '';
            position: absolute;
            width: 8px;
            height: 8px;
            left: calc(50% - 4px);
            top: calc(50% - 4px);
            background: #000;
            transition: background .7s;
        }
        main .advice .swiper .pagination p:hover::after{
            background: #c7bea0;
        }
        main .advice .swiper .pagination p.active::after{
            background: #000;
        }

        main .us{
            position: relative;
            z-index: 1;
        }
        main .us .inner{
            z-index: 3;
        }
        main .us .inner .txt,
        main .us .inner .pic{
            box-sizing: content-box;
        }
        main .us .inner .txt{
            width: 374px;
            margin-right: -500px;
            padding-top: 35px;
            padding-left: 3%;
            position: relative;
            z-index: 2;
            transition: transform .8s, opacity .8s;
            opacity: 0;
            transform: translateY(70px);
            transition-delay: .6s;
            float: left;
        }
        main .us .inner.frozen .txt{
            opacity: 1;
            transform: translateY(0px);
        }
        main .us .inner .txt .heading{
            font-size: 50px;
            font-weight: bold;
            margin-bottom: 45px;
        }
        main .us .inner .txt .t{
            font-size: 18px;
            line-height: 1.7;
            letter-spacing: 2px;
        }
        main .us .inner .pic{
            float: right;
            padding: 32px 38px 0 0;
            width: 67.5%;
            background: url(../img/common/squareBg.png) no-repeat 50% 50%;
            transform: translateX(100px);
            opacity: 0;
            margin-right: 6.5%;
            transition: transform .8s, opacity .8s, background 1s linear .2s;
            margin-bottom: 65px;
        }
        main .us .inner.frozen .pic{
            transform: translate(0px);
            opacity: 1;
            background: url(../img/common/squareBg.png) no-repeat 100% 0%;
        }
        main .us .inner .pic img{
            display: block;
            width: 100%;
            height: auto;
        }
        main .us .inner .contact{
            max-width: 350px;
            margin: 0 auto;
            clear: both;
            text-align: center;
            padding-top: 187px;
            position: relative;
            padding-bottom: 206px;
        }
        main .us .inner .contact .scrollDown{
            top: 0px;
        }
        main .us .inner .contact .scrollDown i{
            height: 126px;
            transform: scaleY(0);
        }
        
        main .us .inner .contact .box{
            transform: translateY(80px);
            opacity: 0;
            transition: transform .8s,opacity .8s;
        }
        main .us .inner .contact.frozen .box{
            transform: translateY(0px);
            opacity: 1;
        }
        main .us .inner .contact h5{
            font-size: 28px;
        }
        main .us .inner .contact p{
            font-size: 16px;
            margin-top: 40px;
            margin-bottom: 45px;
        }
        main .us::before{
            content: '';
            position: absolute;
            z-index: 2;
            width: 2000px;
            height: 1400px;
            background: url(../img/triangle.png) no-repeat center bottom;
            left: calc(50% - 1000px);
            bottom: 0px;
        }
        main .us::after{
            content: '';
            position: absolute;
            width: 480px;
            height: 480px;
            background: #c7bea0;
            bottom: 65px;
            left: 50%;
            opacity: 0;
            margin-bottom: 100px;
            transform: translateX(-50%) rotate(45deg);
            transition-property: opacity,margin;
            transition-duration: .8s;
        }
        main .us.frozen::after{
            opacity: 1;
            margin-bottom: 0px;
        }
        main .us .muchMore{
            color: #000;
            margin-top: 0px;
        }

        main .articles{
            position: relative;
            padding-top: 1300px;
            margin-top: -1200px;
            padding-bottom: 85px;
            z-index: 0;
        }
        main .articles::before{
            content: '';
            position: absolute;
            background: #14171c;
            top: 0px;
            left: 0px;
            opacity: .88;
            z-index: 2;
            width: 100%;
            height: 100%;
        }
        main .articles .inner{
            z-index: 3;
        }
        main .articles .inner .box{
            flex-wrap: wrap;
            margin-right: -45px;
        }
        main .articles .inner .box .item{
            width: calc(100% / 3 - 45px);
            margin-right: 45px;
            padding: 76px 55px;
            padding-bottom: 73px;
            min-height: 500px;
            position: relative;
            transform: translateY(100px);
            opacity: 0;
            transition: transform .8s,opacity .8s;
            border: 6px solid rgba(255, 255, 255, 0.2);
        }
        main .articles .inner .box .item.frozen{
            transform: translateY(0px);
            opacity: 1;
        }
        main .articles .inner .box .item:nth-child(2){
            transition-delay: .4s;
        }
        main .articles .inner .box .item:nth-child(3){
            transition-delay: .8s;
        }
        main .articles .inner .box .item .more span{
            color: #fff;
        }
        main .articles .inner .box .item .atclTtl{
            font-size: 32px;
            transition: color .7s;
            font-weight: bold;
            color: #fff;
        }
        main .articles .inner .box .item .atclTtl:hover{
            color: #c5be9f;
        }
        main .articles .inner .box .item .category{
            margin-top: 8px;
            margin-bottom: 13px;
        }
        main .articles .inner .box .item .t{
            font-size: 16px;
            color: #d2d2d1;
            margin-bottom: 12px;
        }
        main .articles .inner .box .item:last-child{
            padding: 30px 50px;
        }
        main .articles .inner .box .item .mid{
            height: 100%;
            flex-direction: column;
        }
        main .articles .inner .box .item .mid .square{
            height: 168px;
            position: relative;
        }
        main .articles .inner .box .item .mid .square::before{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -54px;
            transform: translateX(-50%) rotate(45deg);
            width: 160px;
            height: 160px;
            border: 15px solid rgba(199,190,160,0.1);
        }
        main .articles .inner .box .item .mid .muchMore{
            margin-top: 118px;
        }
        main .articles .inner .box .item .mid .muchMore span{
            line-height: 20px;
            height: 20px;
            padding-left: 40px;
            position: relative;
            font-size: 14px;
            background: url(../img/common/linkIcon.png) no-repeat center left;
        }
        main .articles .inner .box .item .mid .muchMore span:before{
            content: '';
            width: 21px;
            height: 20px;
            top: 0px;
            left: 0px;
            position: absolute;
            z-index: 2;
            pointer-events: none;
            background: url(../img/common/linkIcon.png) no-repeat center center;
            opacity: 0;
            transition: opacity .5s;
        }
        main .articles .inner .box .item .mid .muchMore:hover span:before{
            opacity: 1;
        }
        main .articles .inner .box .item>span{
            position: absolute;
            background: #fff;
        }
        main .articles .inner .box .item .hor{
            height: 6px;
            width: 0%;
            transition: width .3s linear;
        }
        main .articles .inner .box .item .ver{
            width: 6px;
            height: 0%;
            transition: height .3s linear;
        }
        main .articles .inner .box .item.frozen .hor{
            width: calc(100% + 6px);
        }
        main .articles .inner .box .item.frozen .ver{
            height: calc(100% + 6px);
        }
        main .articles .inner .box .item .tp,
        main .articles .inner .box .item .tp + *{
            top: -6px;
        }        
        main .articles .inner .box .item .rht,
        main .articles .inner .box .item .rht + *{
            right: -6px;
        }
        main .articles .inner .box .item .btm,
        main .articles .inner .box .item .btm + *{
            bottom: -6px;
        }
        main .articles .inner .box .item .lft,
        main .articles .inner .box .item .tp{
            left: -6px;
        }

        main .articles .inner .box .item:nth-child(1) .tp{
            transition-delay: .8s;
        }
        main .articles .inner .box .item:nth-child(1) .rht{
            transition-delay: 1.1s;
        }
        main .articles .inner .box .item:nth-child(1) .btm{
            transition-delay: 1.4s;
        }
        main .articles .inner .box .item:nth-child(1) .lft{
            transition-delay: 1.7s;
        }
        main .articles .inner .box .item:nth-child(2) .tp{
            transition-delay: 1.2s;
        }
        main .articles .inner .box .item:nth-child(2) .rht{
            transition-delay: 1.5s;
        }
        main .articles .inner .box .item:nth-child(2) .btm{
            transition-delay: 1.8s;
        }
        main .articles .inner .box .item:nth-child(2) .lft{
            transition-delay: 2.1s;
        }
        main .articles .inner .box .item:nth-child(3) .tp{
            transition-delay: 1.6s;
        }
        main .articles .inner .box .item:nth-child(3) .rht{
            transition-delay: 1.9s;
        }
        main .articles .inner .box .item:nth-child(3) .btm{
            transition-delay: 2.2s;
        }
        main .articles .inner .box .item:nth-child(3) .lft{
            transition-delay: 2.5s;
        }
        main .articles .inner .rtt{
            position: absolute;
            font-size: 18px;
            letter-spacing: 10px;
            color: #c0b594;
            transform-origin: top right;
            transform: translateX(calc(-100% - 30px)) rotate(-90deg);
        }


        main .pageBtm{
            position: relative;
            height: 380px;
        }
        main .pageBtm .pic::before{
            content: '';
            width: 100%;
            height: 100%;
            position: absolute;
            z-index: 2;
            top: 0px;
            left: 0px;
            box-sizing: border-box;
            border-color: rgba(255,255,255,.2);
            border-style: solid;
            transition: border .8s;
        }
        main .pageBtm.frozen .pic::before{
            border-width: 25px;
        }
        main .pageBtm .t{
            z-index: 2;
            width: 100%;
            text-align: center;
            line-height: 1;
            font-size: 54px;
            color: #fff;
            font-weight: bold;
            padding-bottom: 50px;
            margin-top: 30px;
            opacity: 0;
            transition: margin .8s, opacity .8s;
            transition-delay: .5s;
        }
        main .pageBtm.frozen .t{
            opacity: 1;
            margin-top: 0px;
        }
        main .pageBtm .t::before,
        main .pageBtm .t::after{
            content: '';
            position: absolute;
            bottom: 0px;
            width: 9px;
            height: 9px;
            border: 2px solid #bdb297;
            left: calc(50% - 8px);
        }
        main .pageBtm .t::before{
            transform: translateX(-5px) rotate(45deg);
        }
        main .pageBtm .t::after{
            transform: translateX(5px) rotate(45deg);
        }
        main .pageBtm .t span{
            padding: 0px 80px;
            background: url(../img/cateInfo/lineSquare.png) 100% 50% no-repeat;
            display: inline-block;
            vertical-align: top;
        }
        
        @media(max-width:1800px){
            main .tips>.t{
                padding-top: 96px;
                padding-bottom: 72px;
            }
        }

        @media(max-width:1700px){
            main .tips>.t{
                padding-top: 76px;
                padding-bottom: 52px;
            }
        }

        @media(max-width:1640px){
            main .pageHead{
                width: 100%;
                padding: 0px 20px;
            }
            main .pageHead .contn .tp .pic::before,
            main .pageHead .contn .tp::after{
                height: calc((100vw - 17px - 40px) * .95 * .3);
                top: calc(100% - (100vw - 17px - 40px) * .95 * .3 * 2.414213 / 2);
                border-width: calc((100vw - 17px - 40px) * .95 * .026);
                margin-top: calc((100vw - 17px - 40px) * .95 * .018);
            }
            main .pageHead .contn .tp .txt{
                top:calc(100% - (100vw - 17px - 40px) * .95 * .3 * 1.414213 / 2);
                margin-top: calc((100vw - 17px - 40px) * .95 * .018);
            }
            
        }

        @media(max-width:1600px){
            main .pageHead .contn .tp .txt p{
                font-size: 66px;
                margin-bottom: 20px;
            }
            main .pageHead .contn .tp .txt .dsnName{
                font-size: 22px;
            }

            main .tips>.t{
                padding-top: 57px;
                padding-bottom: 33px;
                font-size: 21px;
            }
            main .tips .list .item{
                width: 360px;
                height: 360px;
            }
            main .tips .list .item .txt{
                font-size: 16px;
                width: 260px;
            }
            main .tips .list .item .txt .topic{
                font-size: 25px;
            }

            main .note .lft .icon{
                width: 38%;
                height: auto;
                left: 12%;
            }
            main .note .rht .noteTtl{
                font-size: 28px;
            }

            main .selected .btn.prev{
                left: 65px;
            }
            main .selected .btn.next{
                right: 65px;
            }

            main .advice::before{
                width: 528px;
                height: 528px;
                border-width: 38px;
            }
            main .advice .swiper::before{
                width: 528px;
                height: 528px;
                border-width: 34px;
            }
            main .advice .swiper li{
                height: 610px;
            }
            main .advice .swiper li .box .inner{
                font-size: 16px;
            }
            main .advice .swiper li .box .inner .hgLtr{
                font-size: 48px;
                margin-top: 15px;
            }
            main .advice .swiper .btn.prev{
                margin-left: calc(40px - 528px * 1.414213 / 2);
            }
            main .advice .swiper .btn.next{
                margin-left: calc(528px * 1.414213 / 2 - 40px);
            }

            main .us::after{
                width: 460px;
                height: 460px;
                bottom: 58px;
            }
            main .us .inner .txt{
                padding-top: 35px;
                padding-left: 33px;
            }
            main .us .inner .pic{
                padding-top: 32px;
                padding-right: 38px;
                margin-bottom: 60px;
            }
            main .us .inner .txt .heading{
                font-size: 48px;
                margin-bottom: 24px;
            }
            main .us .inner .txt .t{
                font-size: 16px;
            }
            main .us .inner .contact{
                padding-top: 177px;
            }
            main .us .inner .contact .scrollDown i{
                height: 120px;
            }
            main .us .inner .contact p{
                margin-top: 25px;
                margin-bottom: 30px;
            }
        }
        @media(max-width:1480px){
            main .selected .list .item{
                padding-top: 95px;
            }
            main .selected .pics,
            main .selected .txt{
                width: 82%;
                margin: 0 auto;
            }
            main .selected .list .item.active .tip{
                width: 34%;
            }
        }
        @media(max-width:1350px){
            main .tips .list .item .tpRht{
                display: none;
            }
            main .tips .list .item:last-child{
                display: block;
                margin: 0 auto;
            }
            main .tips .list .item.frozen + .item .border .ver{
                height: 100%;
            }
            main .tips .list .item.frozen + .item .border .hor{
                width: 100%;
            }
            main .tips .list .item.frozen + .item .txt{
                opacity: 1;
                margin-top: 0px;
            }

            main .note .rht{
                padding: 0 1.5% 0 5%;
                right: 30px;
                top: calc((100% - 55px) * .08 + 55px);
                bottom: calc((100% - 55px) * .08);
            }
            
            main .selected .list .item{
                padding-top: 90px;
            }
            main .selected .pics,
            main .selected .txt{
                width: 70%;
            }
            main .selected .list .item .tip::before{
                right: 116px;
                width: 152px;
                height: 152px;
            }
            main .selected .list .item .tip .extra .price{
                font-size: 120px;
            }
            main .selected .list .item .txt .itemName{
                font-size: 24px;
            }
            main .selected .list .item .txt .inf{
                font-size: 15px;
            }
            main .selected .list .item.active .tip{
                width: 37%;
            }

            main .articles .inner .box .item{
                padding: 68px 41px;
                margin-right: 30px;
                width: calc(100% / 3 - 30px);
                min-height: 450px;
            }
            main .articles .inner .box .item:last-child{
                padding: 26px 44px;
            }
            main .articles .inner .box .item .mid .square{
                height: 160px;
            }
            main .articles .inner .box .item .mid .square::before{
                width: 153px;
                height: 153px;
                border-width: 14px;
            }
            main .articles .inner .box .item .mid .muchMore{
                margin-top: 113px;
            }
            main .articles .inner .box .item .atclTtl{
                font-size: 27px;
            }

            main .pageBtm .t{
                font-size: 48px;
            }
        }
        @media(max-width:1200px){
            main .tips>.t{
                padding-top: 35px;
                padding-bottom: 30px;
                max-width: 800px;
                font-size: 18px;
            }
            main .tips .list{
                padding-top: 68px;
                padding-bottom: 90px;
            }
            main .tips .list .item{
                width: 348px;
                height: 348px;
            }
            main .tips .list .item .block{
                width: 34px;
                height: 34px;
            }
            main .tips .list .item .txt{
                font-size: 14px;
                width: 245px;
            }
            main .tips .list .item .txt .topic{
                font-size: 22px;
            }

            main .note,
            main .selected,
            main .us .inner,
            main .articles .inner{
                padding: 0px 30px;
            }
            main .note .rht .txt{
                font-size: 14px;
            }
            main .note .rht .noteTtl{
                margin-bottom: 25px;
            }

            main .selected{
                padding-bottom: 83px;
            }
            main .selected .list .item .tip::before{
                top: 35px;
            }
            main .selected .list .item .tip .extra .price{
                font-size: 110px;
            }
            main .selected .list .item .tip .extra .t{
                font-size: 14px;
            }

            main .advice::before{
                width: 520px;
                height: 520px;
                border-width: 36px;
            }
            main .advice .swiper::before{
                width: 520px;
                height: 520px;
                border-width: 32px;
            }
            main .advice .swiper li{
                height: 595px;
            }
            main .advice .swiper li .box .inner .hgLtr{
                font-size: 46px;
            }
            main .advice .swiper .btn.prev{
                margin-left: calc(40px - 520px * 1.414213 / 2);
            }
            main .advice .swiper .btn.next{
                margin-left: calc(520px * 1.414213 / 2 - 40px);
            }
            main .advice .swiper .pagination{
                bottom: 120px;
            }

            main .us::after {
                width: 426px;
                height: 426px;
                bottom: 54px;
            }
            main .us .inner .txt{
                padding-left: 0px;
            }
            main .us .inner .txt .heading{
                font-size: 44px;
            }
            main .us .inner .pic{
                margin-right: 0px;
                width: 71%;
                margin-bottom: 30px;
            }
            main .us .inner .contact{
                padding-top: 150px;
            }
            main .us .inner .contact .scrollDown i{
                height: 102px;
            }
            main .articles .inner .box .item{
                min-height: 420px;
            }
            
            main .articles .inner .box .item .mid .square{
                height: 150px;
            }
            main .articles .inner .box .item .mid .square::before{
                width: 143px;
                height: 143px;
                border-width: 13px;
            }
            main .articles .inner .box .item .mid .muchMore{
                margin-top: 105px;
            }
            main .articles .inner .rtt{
                font-size: 16px;
                transform: translateX(calc(-100% - 24px)) rotate(-90deg);
            }
            

            main .pageBtm .t{
                padding-bottom: 30px;
                font-size: 44px;
            }
            main .pageBtm .t span{
                width: 100%;
                padding: 0px;
            }
        }

        @media(max-width:1024px){
            main .pageHead .contn .tp .txt p{
                font-size: 47px;
                margin-bottom: 13px;
            }
            main .pageHead .contn .tp .txt .dsnName{
                font-size: 17px;
            }

            main .tips>.t{
                width: 450px;
                font-size: 14px;
                height: 230px;
            }
            main .tips .list .item{
                width: 324px;
                height: 324px;
            }
            main .tips .list .item .block{
                width: 32px;
                height: 32px;
            }
            main .tips .list .item .txt{
                font-size: 13px;
                width: 240px;
            }
            main .tips .list .item .txt .topic{
                margin-bottom: 30px;
                font-size: 21px;
            }
            main .tips .list .item .border .hor{
                height: 11px;
            }
            main .tips .list .item .border .ver{
                width: 11px;
            }
            main .tips .list .item .block{
                border-width: 11px;
            }
            main .tips .list .item .block::before,
            main .tips .list .item .block::after{
                width: 11px;
                height: 11px;
            }

            main .note{
                padding-top: 60px;
                display: block;
            }
            main .note .lft{
                width: 100%;
                max-width: 842px;
                padding-top: 30px;
                margin: 0px auto;
            }
            main .note .rht{
                width: 100%;
                max-width: 650px;
                margin: 0 auto;
                padding: 50px 35px 25px 35px;
                margin-top: -43px;
                position: relative;
                right: 0px;
            }
            main .note .rht .txt{
                display: block;
                font-size: 12px;
            }
            main .note .rht .noteTtl{
                font-size: 22px;
                margin-bottom: 17px;
            }
            main .note .rht .t{
                padding: 0px 34px 4px 6px;
            }
            main .note>a{
                top: 18px;
                right: 30px;
                font-size: 12px;
                margin-right: 0px;
            }
            main .note .lft,
            main .note .rht{
                opacity: 1;
                transform: translateX(0px);
            }

            main .selected .list .item{
                padding-top: 85px;
            }
            main .selected .list .item .pics .rht{
                top: 60px;
            }
            main .selected .list .item .txt{
                margin-top: 32px;
            }
            main .selected .list .item .tip::before{
                right: 43px;
                width: 146px;
                height: 146px;
            }
            main .selected .list .item .tip .extra .symbol{
                font-size: 52px;
                line-height: 100px;
            }
            main .selected .list .item .tip .extra .price{
                font-size: 86px;
            }
            main .selected .list .item .tip .extra .t{
                padding-left: 17px;
                font-size: 12px;
            }
            main .selected .muchMore{
                margin-top: 34px;
            }

            main .advice{
                padding-bottom: 75px;
            }
            main .advice::before{
                width: 484px;
                height: 484px;
                border-width: 34px;
                top: calc(50% - 75px / 2);
            }
            main .advice .swiper::before{
                width: 484px;
                height: 484px;
                border-width: 30px;
            }
            main .advice .swiper li{
                height: 555px;
            }
            main .advice .swiper li .box .inner{
                font-size: 14px;
            }
            main .advice .swiper li .box .inner .hgLtr{
                font-size: 43px;
            }
            main .advice .swiper .btn.prev{
                margin-left: calc(40px - 484px * 1.414213 / 2);
            }
            main .advice .swiper .btn.next{
                margin-left: calc(484px * 1.414213 / 2 - 40px);
            }
            main .advice .swiper .pagination{
                bottom: 100px;
            }

            main .us .inner .txt,
            main .us .inner .pic{
                width: 100%;
                max-width: 650px;
                box-sizing: border-box;
                margin: 0 auto;
                float: initial;
                text-align: center;
            }
            main .us .inner .pic{
                margin-top: 60px;
                margin-bottom: 26px;
            }
            main .us::after {
                width: 414px;
                height: 414px;
                bottom: 52px;
            }
            main .us .inner .txt .heading{
                font-size: 34px;
            }
            main .us .inner .txt .t{
                font-size: 14px;
            }
            main .us .inner .contact h5{
                font-size: 24px;
            }

            main .articles .inner .box{
                margin-right: 0px;
            }
            main .articles .inner .box .item{
                padding: 66px 36px;
                margin-right: 0px;
                width: 48%;
                min-height: 360px;
            }
            main .articles .inner .box .item .category{
                margin-bottom: 9px;
            }
            main .articles .inner .box .item:first-child{
                margin-right: 4%;
            }
            main .articles .inner .box .item:last-child{
                padding: 43px 0px;                
                margin-top: 43px;
                min-height: auto;
                transition-delay: 0s;
            }
            main .articles .inner .box .item:nth-child(3) .tp{
                transition-delay: .8s;
            }
            main .articles .inner .box .item:nth-child(3) .rht{
                transition-delay: 1.1s;
            }
            main .articles .inner .box .item:nth-child(3) .btm{
                transition-delay: 1.4s;
            }
            main .articles .inner .box .item:nth-child(3) .lft{
                transition-delay: 1.7s;
            }
            main .articles .inner .box .item .mid .square{
                height: 145px;
            }
            main .articles .inner .box .item .mid .square::before{
                width: 138px;
                height: 138px;
                border-width: 12px;
            }
            main .articles .inner .box .item .mid .muchMore{
                margin-top: 101px;
            }
            main .articles .inner .box .item .atclTtl{
                font-size: 25px;
            }
            main .articles .inner .rtt{
                font-size: 14px;
                transform: translateX(calc(-100% - 22px)) rotate(-90deg);
            }

            main .pageBtm .t{
                font-size: 34px;
            }
        }
        @media(min-width:768){
            main .tips .swiper{
                display: none;
            }
        }
        @media(max-width:767px){
            main .pageHead .contn .tp .txt p{
                font-size: 44px;
            }
            main .pageHead .contn .tp .txt .dsnName{
                font-size: 15px;
            }

            main .tips>.t{
                width: 80%;
                margin-top: -24px;
                margin-bottom: -24px;
                background: #dededf;
                padding: 0px 15px;
                padding-top: 24px;
                padding-bottom: 48px;
                height: initial;
            }
            main .tips .list{
                display: none;
            }
            main .tips .list .item{
                width: 300px;
                height: 300px;
                display: block;
                margin: 0 auto !important;
                z-index: 2 !important;
            }
            main .tips .list .item .block{
                display: none;
            }
            main .tips .list .item .txt{
                font-size: 12px;
            }
            main .tips .list .item .txt .topic{
                font-size: 20px;
                margin-bottom: 28px;
            }
            
            main .note,
            main .selected,
            main .us .inner,
            main .articles .inner{
                padding-left: 15px;
                padding-right: 15px;
            }
            main .note .rht{
                width: 95%;
                padding:  48px 20px 24px 20px;
            }
            main .note .rht .noteTtl{
                font-size: 20px;
                margin-bottom: 15px;
            }
            main .note .rht .t{
                padding-right: 30px;
            }
            main .note>a{
                right: auto;
                left: 20px;
            }

            main .selected{
                padding-bottom: 72px;
            }
            main .selected .list{
                overflow: hidden;
            }
            main .selected .list .item{
                padding-top: 0px;
            }
            main .selected .list .item .txt{
                margin-top: 0px;
            }
            main .selected .pics, 
            main .selected .txt{
                width: 100%;
            }
            main .selected .list .item .pics .lft{
                width: 100%;
                height: 280px;
            }
            main .selected .list .item .pics .rht,
            main .selected .list .item .tip{
                display: none;
            }
            main .selected .list .item .txt .itemName{
                font-size: 20px;
                padding-top: 16px;
                padding-bottom: 10px;
            }
            main .selected .list .item .txt .inf{
                font-size: 14px;
            }
            main .selected .list .item .txt .inf p{
                display: block;
            }
            main .selected .btn{
                top: 140px;
            }
            main .selected .btn.prev{
                left: 32px;
            }
            main .selected .btn.next{
                right: 32px;
            }

            main .advice{
                padding-bottom: 69px;
            }
            main .advice::before{
                width: 440px;
                height: 440px;
                border-width: 32px;
                top: calc(50% - 69px / 2);
            }
            main .advice .swiper::before{
                width: 440px;
                height: 440px;
                border-width: 28px;
            }
            main .advice .swiper li{
                height: 515px;
            }
            main .advice .swiper li .box .inner{
                font-size: 12px;
            }
            main .advice .swiper li .box .inner .hgLtr{
                font-size: 32px;
                margin-top: 12px;
                padding-bottom: 32px;
            }
            main .advice .swiper .btn.prev{
                margin-left: calc(40px - 440px * 1.414213 / 2);
            }
            main .advice .swiper .btn.next{
                margin-left: calc(440px * 1.414213 / 2 - 40px);
            }
            main .advice .swiper .pagination{
                bottom: 70px;
            }

            main .us::after{
                width: 240px;
                height: 240px;
                bottom: 32px;
            }
            main .us .inner .txt{
                margin-bottom: 20px;
            }
            main .us .inner .txt .heading{
                font-size: 32px;
            }
            main .us .inner .txt .t{
                font-size: 12px;
            }
            main .us .inner .pic{
                padding-right: 0px;
            }
            main .us .inner .contact p{
                margin-top: 21px;
                margin-bottom: 26px;
            }
            main .us .inner .contact{
                padding-top: 0px;
            }
            main .us .inner .contact .scrollDown{
                display: none;
            }

            main .articles .inner .box .item{
                width: 100%;
                padding: 60px 11px;
                min-height: initial;
            }
            main .articles .inner .box .item:first-child{
                margin-right: 0px;
            }
            main .articles .inner .box .item:nth-child(2){
                display: none;
            }
            main .articles .inner .box .item:last-child{
                padding: 40px 0px;
                margin-top: 40px;
            }
            main .articles .inner .box .item .mid .square{
                height: 134px;
            }
            main .articles .inner .box .item .mid .square::before{
                width: 128px;
                height: 128px;
            }
            main .articles .inner .box .item .mid .muchMore{
                margin-top: 94px;
            }
            main .articles .inner .box .item .atclTtl{
                font-size: 22px;
            }
            main .articles .inner .box .item .t,
            main .articles .inner .rtt{
                display: none;
            }

            main .pageBtm .t{
                font-size: 32px;
            }
            main .pageBtm .t span{
                background: initial;
            }
        }

        @media(max-width:580px){
            main .pageHead .contn .tp .txt .dsnName{
                display: none;
            }
        }
        @media(max-width:480px){
            main .pageHead{
                padding: 0px;
            }
            main .pageHead .contn .btm{
                height: 272px;
            }
            main .pageHead .contn .btm img{
                height: 100%;
                object-fit: cover;
            }
            main .pageHead .contn .tp .txt p{
                font-size: 32px;
                margin-bottom: 8px;
            }
            main .pageHead .contn .tp{
                width: 460px;
            }
            
            main .pageHead .contn .tp .pic{
                clip-path: polygon(10px 0%,calc(100% - 10px) 0,calc(100% - 10px) 10px,50% 100%,10px 10px);
            }
            main .pageHead .contn .tp .pic::before,
            main .pageHead .contn .tp::after{
                height: calc(460px * .3);
                top: calc(100% - 460px * .3 * 2.414213 / 2);
                border-width: calc(460px * .026);
                margin-top: calc(460px * .018);
            }
            main .pageHead .contn .tp .txt{
                top:calc(100% - 460px * .3 * 1.414213 / 2);
                margin-top: calc(460px * .018);
            }

            main .tips>.t{
                font-size: 12px;
                line-height: 2;
            }
        }
        @media(min-width:451){
            main .tips .swiper{
                display: none;
            }
        }
        @media(max-width:450px){
            main .tips .list{
                display: none;
            }
        }